<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<div id="app"></div>
<script type="text/regular" id="tableTpl">
    <kl-table loading={table.loading} stickyFooter source={table.source} paging={table.paging}
        on-paging={this.onPaging($event)}>
        <kl-table-col key="id" name="ID" />
        <kl-table-col key="name" name="名称" />
        <kl-table-col key="imageUrl" name="图片" />
        <kl-table-col key="createdAt" name="创建时间" />
    </kl-table>

    <button on-click={this.getClick()}>get</button>
    <button on-click={this.addClick()}>add</button>
    <button>delete</button>
</script>


<link rel="stylesheet" href="//unpkg.com/nek-ui/dist/css/nek-ui.default.min.css">
<script type="text/javascript" src="//unpkg.com/nek-ui/dist/vendor/regular.min.js"></script>
<script type="text/javascript" src="//unpkg.com/nek-ui/dist/js/nek-ui.min.js"></script>
<script src="../src/javascript/lib/nej/define.js"></script>

<script>
    define([
        'base/klass',
        'util/ajax/xdr',
        'pro/cache/baseCache',
        'base/util'
    ],function (_klass,_ajax,_baseCache,_util,_p) {

        var component = new NEKUI.Component({
            template: '#tableTpl',
            data: {
                table: {
                    source: [],
                    paging: {
                        pageSize: 10,
                        current: 1
                    },
                    loading: true
                }
            },
            init: function () {
            },
            onPaging: function(event) {
                cc._$getList({key: 'node-list',
                    data: {
                        page: event.current,
                        limit: 10,
                        orderBy: 'createdAt',
                        order: 'desc'
                    },
                    offset: (event.current - 1)*event.paging.pageSize,
                    limit: event.paging.pageSize});
            },
            getClick: function () {
                cc._$getItem({id: 10, key: 'id'})
            },
            addClick: function () {
                cc._$addItem({key:'node-list', push: false })
            }
        });
        component.$inject('#app');

        _p.NodeListCache = _klass._$klass();
        _pro = _p.NodeListCache._$extend(_baseCache.BaseCache);

        _pro.__init = function (_options) {
            this.__super(_options);
        };

        _pro.__reset = function (_options) {
            this.__super(_options);
        };

        var cc = _p.CustomCache._$allocate({
            id: 'node-list',
            autogc: true,
            doloaditem: function (_options) {
                console.log(_options);
                _ajax._$request('http://597899c78f22b00011d6f16c.mockapi.io/api/v1/node/'
                    + _options.data.id, {
                    data: _options.data,
                    type: 'json',
                    onload: function (data) {
                        _options.onload(data.data);
                    }._$bind(this)
                })
            },
            doloadlist: function (_options) {
                var that = this;
                _ajax._$request('http://597899c78f22b00011d6f16c.mockapi.io/api/v1/node', {
                    type: 'json',
                    onload: function (data1) {
                        _ajax._$request('http://597899c78f22b00011d6f16c.mockapi.io/api/v1/node', {
                            type: 'json',
                            data: _options.data,
                            onload: function (data) {
                                that._$setTotal('node-total', data1.length);
                                _options.onload(data);
                            }
                        });
                    }
                });
            },
            doadditem: function (_options) {
                _ajax._$request('http://597899c78f22b00011d6f16c.mockapi.io/api/v1/node', {
                    type: 'json',
                    data: _options.data,
                    method: 'POST',
                    onload: function (data) {
                        //that._$setTotal('total', data1.length);
                        _options.onload(data);
                    }
                });
            }
        });
        cc._$getList({key: 'node-list', data: {
            page: 1,
            limit: 10,
            orderBy: 'createdAt',
            order: 'desc'
        }, offset: 0, limit: 10});

        /*function A() {
            this.list = {'list': [1]};
        }

        A.prototype.getList = function (key) {
            return this.list[key];
        };

        var a = new A();
        var list = a.getList('list');
        list.push(23,4);
        console.log(a); // [1,23,4]*/






    })
</script>
</body>
</html>